<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Title</title>
</head>
<style>
	*{
		margin:0;
		padding:0;
	}
	#wrap{
		border:1px solid #f00;
		width: 750px;
		height:1000px;
		margin:0 auto;

	}
	.nav{
		display: flex;
		/*控制盒子的换行问题？*/
		flex-wrap: wrap;
	}
	.son{
		width:20%;
		height:100px;
		background: #ccc;
		border:1px solid blue;
		box-sizing: border-box;
	}
</style>
<body>
 <div id="wrap">
	 <div class="nav">
		 <div class="son">1</div>
		 <div class="son">2</div>
		 <div class="son">3</div>
		 <div class="son">4</div>
		 <div class="son">5</div>
		 <div class="son">6</div>
		 <div class="son">7</div>
		 <div class="son">8</div>
		 <div class="son">9</div>
		 <div class="son">10</div>
	 </div>
 </div>
</body>
</html>